﻿<!DOCTYPE html>
<html>

<head>
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>角色管理-列表</title>
    <script src="/scripts/vue.js"></script>
    <script src="/scripts//axios.min.js"></script>
    <script src="/scripts/heyui/heyui.js"></script>
    <link rel="stylesheet" href="/scripts/heyui/css/heyui.blue.theme.css">
    <link rel="stylesheet" href="/styles/global.css">
    <script src="/scripts/lib.js"></script>
</head>

<body>
    <div id="app">
        <div id="app" class="page-body">
            <page-header title="角色管理列表"></page-header>
            <div class="page-search-view">
                <h-form mode="threecolumn" label-position="left">
                    <h-form-item label="账号">
                        <input type="text" v-model="queryParms.Account" />
                    </h-form-item>
                    <h-form-item label="真实姓名">
                        <input type="text" v-model="queryParms.Name" />
                    </h-form-item>
                    <h-form-item label="角色权限">
                        <h-select :datas="sysRoleData" key-name="ID" title-name="Name" filterable v-model="queryParms.SysRole_ID"></h-select>
                    </h-form-item>

                    <h-form-item :no-padding="true" single>
                        <h-button color="primary" @click="onSearch">查询</h-button>
                    </h-form-item>
                </h-form>
            </div>
            <div class="page-search-btns">
                    <h-button icon="h-icon-plus" @click="onAdd"><span>创建</span></h-button>
                    <h-button icon="h-icon-trash" @click="onDeleteAll"><span>删除</span></h-button>
            </div>
            <div class="page-data-view">
                <table-service :url="pageDataUrl" :parms="queryParms" @onchange="onDataChange" ref="tableService">
                    <h-table :datas="pageData" checkbox :height="600" ref="table">
                        <h-table-item title="账号" prop="Account"></h-table-item>
                        <h-table-item title="真实姓名" prop="Name"></h-table-item>
                        <h-table-item title="图像">
                            <template v-slot="{data}">
                                <h-avatar type="female" :src="data.Pic" noInfo></h-avatar>
                            </template>
                        </h-table-item>
                        <h-table-item title="性别" prop="Sex" :format="tableFormatSex"></h-table-item>
                        <h-table-item title="禁止登陆">
                            <template v-slot="{data}">
                                <span class="h-tag h-tag-green" v-if="data.DisabledState==0">正常</span>
                                <span class="h-tag h-tag-gray" v-else-if="data.DisabledState==1">禁止</span>
                            </template>
                        </h-table-item>
                        <h-table-item title="创建日期" prop="CreateDateTime"></h-table-item>
                        <h-table-item title="修改日期" prop="UpdateDateTime"></h-table-item>
                        <h-table-item title="操作">
                            <template v-slot="{data}">
                                <a href="javascript:;" @click="onEdit(data.ID)">编辑</a>
                                <a href="javascript:;" class="red-color" @click="onDeleteSingle(data.ID)">删除</a>
                            </template>
                        </h-table-item>
                        <div class="page-data-empty-tip" slot="empty"><i class="h-icon-warn"></i><span>没有查询到符合条件的记录</span></div>
                    </h-table>
                </table-service>
            </div>
        </div>
    </div>
</body>

</html>
<script src="/controller/system/SysUserList.js"></script>